<template>
  <a-form
    ref="appActionFormRef"
    :model="appActionModel"
    :rules="appActionFormRule"
    :layout="layout"
    v-bind="formItemLayout"
  >
    <a-form-item name="actionName" :label="t('org.app-action.actionName')">
      <a-input v-model:value="appActionModel.actionName" :placeholder="t('org.app-action.formPlhActionName')" />
    </a-form-item>
    <a-form-item name="actionType" :label="t('org.app-action.actionType')">
      <qc-dictionary-select
        :placeholder="t('org.app-action.formPlhActionType')"
        :codeItemId="AppActionTypeDic"
        :disabled="true"
        v-model:value="appActionModel.actionType"
      ></qc-dictionary-select>
    </a-form-item>
    <a-form-item name="sortNo" :label="t('org.app-action.sortNo')">
      <a-input-number
        :min="1"
        :max="9999999"
        style="width: 100%"
        :placeholder="t('org.app-action.formPlhSortNo')"
        v-model:value="appActionModel.sortNo"
      />
    </a-form-item>
    <a-form-item name="authorityKey" :label="t('org.app-action.authorityKey')">
      <a-input v-model:value="appActionModel.authorityKey" :placeholder="t('org.app-action.formPlhAuthorityKey')" />
    </a-form-item>
  </a-form>
</template>
<script lang='ts'>
import { computed, defineComponent, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { useModelForm } from '/@/kit/model-kit'
import appActionApi from '/@/api/org/app-action'
import { appActionFormRule, AppActionTypeDic } from '../interface'
export default defineComponent({
  props: {
    actionId: String,
    actionType: String,
    layout: {
      type: String,
      default: 'horizontal',
    },
    parentId: String,
  },
  setup(props, { emit }) {
    const { t } = useI18n()
    const appActionFormRef = ref()
    const appActionModel = ref({
      actionType: null,
      parentId: null,
    })

    const layout = props.layout
    const formItemLayout = computed(() => {
      return layout === 'horizontal'
        ? {
            labelCol: { span: 6 },
            wrapperCol: { span: 16 },
          }
        : {}
    })

    const { save } = useModelForm(appActionFormRef, appActionModel, props.actionId, appActionApi, {
      initAddAfter: () => {
        appActionModel.value.actionType = props.actionType
        appActionModel.value.parentId = props.parentId
      },
    })

    //提交方法
    const onSubmit = () => save().then((res) => emit('submitSuccess', res.data.data))

    return {
      t,
      appActionFormRef,
      appActionModel,
      appActionFormRule,
      AppActionTypeDic,
      layout,
      formItemLayout,
      onSubmit,
    }
  },
})
</script>
